<template>
  <div class="app-container">
    <el-form
      :model="queryParams"
      ref="queryForm"
      size="small"
      :inline="true"
      v-show="showSearch"
      label-width="68px"
    >
      <el-form-item label="商品名称" prop="productName">
        <el-input
          v-model="queryParams.productName"
          placeholder="请输入产品名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <!-- <el-form-item label="产品一口价" prop="productPrice">
        <el-input
          v-model="queryParams.productPrice"
          placeholder="请输入产品一口价"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="产品划线价" prop="linePrice">
        <el-input
          v-model="queryParams.linePrice"
          placeholder="请输入产品划线价"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <!-- <el-form-item label="产品编码" prop="productNo">
        <el-input
          v-model="queryParams.productNo"
          placeholder="请输入产品编码"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <!-- <el-form-item label="产品总库存" prop="productStock">
        <el-input
          v-model="queryParams.productStock"
          placeholder="请输入产品总库存"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="最大积分抵扣数量" prop="maxPointsDiscount">
        <el-input
          v-model="queryParams.maxPointsDiscount"
          placeholder="请输入最大积分抵扣数量"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="是否参加分销0否1是" prop="isAgent">
        <el-input
          v-model="queryParams.isAgent"
          placeholder="请输入是否参加分销0否1是"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <!-- <el-form-item label="分销佣金(一级)" prop="firstMoney">
        <el-input
          v-model="queryParams.firstMoney"
          placeholder="请输入分销佣金(一级)"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="分销佣金(二级)" prop="secondMoney">
        <el-input
          v-model="queryParams.secondMoney"
          placeholder="请输入分销佣金(二级)"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="分销佣金(三级)" prop="thirdMoney">
        <el-input
          v-model="queryParams.thirdMoney"
          placeholder="请输入分销佣金(三级)"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <!-- <el-form-item label="访问次数" prop="viewTimes">
        <el-input
          v-model="queryParams.viewTimes"
          placeholder="请输入访问次数"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <!-- <el-form-item label="供应商id" prop="shopSupplierId">
        <el-input
          v-model="queryParams.shopSupplierId"
          placeholder="请输入供应商id"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <el-form-item label="商品价格" prop="supplierPrice">
        <el-input
          v-model="queryParams.supplierPrice"
          placeholder="请输入菜品价格"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <!-- <el-form-item label="限购数量0为不限" prop="limitNum">
        <el-input
          v-model="queryParams.limitNum"
          placeholder="请输入限购数量0为不限"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <!-- <el-form-item label="可购买会员等级id，逗号隔开" prop="gradeIds">
        <el-input
          v-model="queryParams.gradeIds"
          placeholder="请输入可购买会员等级id，逗号隔开"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <!-- <el-form-item label="商品单位" prop="productUnit">
        <el-input
          v-model="queryParams.productUnit"
          placeholder="请输入商品单位"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <!-- <el-form-item label="特殊分类id" prop="specialId">
        <el-input
          v-model="queryParams.specialId"
          placeholder="请输入特殊分类id"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <!-- <el-form-item label="分类" prop="categoryid">
        <el-input
          v-model="queryParams.categoryid"
          placeholder="请输入特殊分类id"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <!-- <el-form-item label="成本价" prop="costPrice">
        <el-input
          v-model="queryParams.costPrice"
          placeholder="请输入成本价"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="最小购买量" prop="minBuy">
        <el-input
          v-model="queryParams.minBuy"
          placeholder="请输入最小购买量"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <!-- <el-form-item label="包装费" prop="bagPrice">
        <el-input
          v-model="queryParams.bagPrice"
          placeholder="请输入包装费"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="打印标签id" prop="labelId">
        <el-input
          v-model="queryParams.labelId"
          placeholder="请输入打印标签id"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item> -->
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="handleQuery"
          >搜索</el-button
        >
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
          >重置</el-button
        >
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['eaten:product:add']"
          >新增</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['eaten:product:edit']"
          >修改</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['eaten:product:remove']"
          >删除</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['eaten:product:export']"
          >导出</el-button
        >
      </el-col>
      <right-toolbar
        :showSearch.sync="showSearch"
        @queryTable="getList"
      ></right-toolbar>
    </el-row>

    <el-table
      v-loading="loading"
      :data="productList"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55" align="center" />
      <!-- <el-table-column label="产品id" align="center" prop="productId" /> -->
      <el-table-column
        label="商品名称"
        align="center"
        :show-overflow-tooltip="true"
        prop="productName"
      />
      <!-- <el-table-column label="产品一口价" align="center" prop="productPrice" />
      <el-table-column label="产品划线价" align="center" prop="linePrice" />
      <el-table-column label="产品编码" align="center" prop="productNo" /> -->
      <el-table-column label="商品总库存" align="center" prop="productStock" />
      <el-table-column label="商品卖点" align="center" prop="sellingPoint" />
      <el-table-column label="商品分类id" align="center" prop="categoryId" />
      <el-table-column
        label="产品规格(10单规格 20多规格)"
        align="center"
        prop="specType"
      />
      <el-table-column
        label="库存计算方式(10下单减库存 20付款减库存)"
        align="center"
        prop="deductStockType"
      />
      <!-- <el-table-column label="产品详情" align="center" prop="content" /> -->
      <el-table-column label="初始销量" align="center" prop="salesInitial" />
      <el-table-column label="实际销量" align="center" prop="salesActual" />
      <el-table-column
        label="产品排序(数字越小越靠前)"
        align="center"
        prop="productSort"
      />
      <el-table-column
        label="是否开启积分赠送(1开启 0关闭)"
        align="center"
        prop="isPointsGift"
      />
      <el-table-column
        label="是否允许使用积分抵扣(1允许 0不允许)"
        align="center"
        prop="isPointsDiscount"
      />
      <el-table-column
        label="最大积分抵扣数量"
        align="center"
        prop="maxPointsDiscount"
      />
      <el-table-column
        label="是否开启会员折扣(1开启 0关闭)"
        align="center"
        prop="isEnableGrade"
      />
      <el-table-column
        label="会员折扣设置(0默认等级折扣 1单独设置折扣)"
        align="center"
        prop="isAloneGrade"
      />
      <el-table-column
        label="单独设置折扣的配置"
        align="center"
        prop="aloneGradeEquity"
      />
      <el-table-column
        label="折扣金额类型(10百分比 20固定金额)"
        align="center"
        prop="aloneGradeType"
      />
      <el-table-column
        label="是否参加分销0否1是"
        align="center"
        prop="isAgent"
      />
      <el-table-column
        label="是否开启单独分销(0关闭 1开启)"
        align="center"
        prop="isIndAgent"
      />
      <el-table-column
        label="分销佣金类型(10百分比 20固定金额)"
        align="center"
        prop="agentMoneyType"
      />
      <el-table-column
        label="分销佣金(一级)"
        align="center"
        prop="firstMoney"
      />
      <el-table-column
        label="分销佣金(二级)"
        align="center"
        prop="secondMoney"
      />
      <el-table-column
        label="分销佣金(三级)"
        align="center"
        prop="thirdMoney"
      />
      <el-table-column
        label="产品状态(10上架 20下架 )"
        align="center"
        prop="productStatus"
      />
      <el-table-column label="访问次数" align="center" prop="viewTimes" />
      <el-table-column label="供应商id" align="center" prop="shopSupplierId" />
      <el-table-column label="供应商价格" align="center" prop="supplierPrice" />
      <el-table-column label="限购数量0为不限" align="center" prop="limitNum" />
      <el-table-column
        label="可购买会员等级id，逗号隔开"
        align="center"
        prop="gradeIds"
      />
      <el-table-column label="0外卖1店内" align="center" prop="productType" />
      <el-table-column label="商品单位" align="center" prop="productUnit" />
      <!-- <el-table-column label="商品属性" align="center" prop="productAttr" />
      <el-table-column label="售卖加料" align="center" prop="productFeed" /> -->
      <el-table-column label="特殊分类id" align="center" prop="specialId" />
      <el-table-column label="成本价" align="center" prop="costPrice" />
      <el-table-column label="最小购买量" align="center" prop="minBuy" />
      <el-table-column label="包装费" align="center" prop="bagPrice" />
      <el-table-column label="打印标签id" align="center" prop="labelId" />
      <el-table-column label="是否删除" align="center" prop="isDelete" />
      <el-table-column label="应用id" align="center" prop="appId" />
      <el-table-column
        label="操作"
        align="center"
        class-name="small-padding fixed-width"
      >
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['eaten:product:edit']"
            >修改</el-button
          >
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['eaten:product:remove']"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改菜品管理对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="产品名称" prop="productName">
          <el-input v-model="form.productName" placeholder="请输入产品名称" />
        </el-form-item>
        <el-form-item label="产品一口价" prop="productPrice">
          <el-input
            v-model="form.productPrice"
            placeholder="请输入产品一口价"
          />
        </el-form-item>
        <el-form-item label="产品划线价" prop="linePrice">
          <el-input v-model="form.linePrice" placeholder="请输入产品划线价" />
        </el-form-item>
        <el-form-item label="产品编码" prop="productNo">
          <el-input v-model="form.productNo" placeholder="请输入产品编码" />
        </el-form-item>
        <el-form-item label="产品总库存" prop="productStock">
          <el-input
            v-model="form.productStock"
            placeholder="请输入产品总库存"
          />
        </el-form-item>
        <el-form-item label="商品卖点" prop="sellingPoint">
          <el-input
            v-model="form.sellingPoint"
            type="textarea"
            placeholder="请输入内容"
          />
        </el-form-item>
        <el-form-item label="产品详情">
          <editor v-model="form.content" :min-height="192" />
        </el-form-item>
        <el-form-item label="最大积分抵扣数量" prop="maxPointsDiscount">
          <el-input
            v-model="form.maxPointsDiscount"
            placeholder="请输入最大积分抵扣数量"
          />
        </el-form-item>
        <el-form-item label="单独设置折扣的配置" prop="aloneGradeEquity">
          <el-input
            v-model="form.aloneGradeEquity"
            type="textarea"
            placeholder="请输入内容"
          />
        </el-form-item>
        <el-form-item label="是否参加分销0否1是" prop="isAgent">
          <el-input
            v-model="form.isAgent"
            placeholder="请输入是否参加分销0否1是"
          />
        </el-form-item>
        <el-form-item label="分销佣金(一级)" prop="firstMoney">
          <el-input
            v-model="form.firstMoney"
            placeholder="请输入分销佣金(一级)"
          />
        </el-form-item>
        <el-form-item label="分销佣金(二级)" prop="secondMoney">
          <el-input
            v-model="form.secondMoney"
            placeholder="请输入分销佣金(二级)"
          />
        </el-form-item>
        <el-form-item label="分销佣金(三级)" prop="thirdMoney">
          <el-input
            v-model="form.thirdMoney"
            placeholder="请输入分销佣金(三级)"
          />
        </el-form-item>
        <el-form-item label="访问次数" prop="viewTimes">
          <el-input v-model="form.viewTimes" placeholder="请输入访问次数" />
        </el-form-item>
        <el-form-item label="供应商id" prop="shopSupplierId">
          <el-input
            v-model="form.shopSupplierId"
            placeholder="请输入供应商id"
          />
        </el-form-item>
        <el-form-item label="供应商价格" prop="supplierPrice">
          <el-input
            v-model="form.supplierPrice"
            placeholder="请输入供应商价格"
          />
        </el-form-item>
        <el-form-item label="限购数量0为不限" prop="limitNum">
          <el-input
            v-model="form.limitNum"
            placeholder="请输入限购数量0为不限"
          />
        </el-form-item>
        <el-form-item label="可购买会员等级id，逗号隔开" prop="gradeIds">
          <el-input
            v-model="form.gradeIds"
            placeholder="请输入可购买会员等级id，逗号隔开"
          />
        </el-form-item>
        <el-form-item label="商品单位" prop="productUnit">
          <el-input v-model="form.productUnit" placeholder="请输入商品单位" />
        </el-form-item>
        <el-form-item label="商品属性" prop="productAttr">
          <el-input
            v-model="form.productAttr"
            type="textarea"
            placeholder="请输入内容"
          />
        </el-form-item>
        <el-form-item label="售卖加料" prop="productFeed">
          <el-input
            v-model="form.productFeed"
            type="textarea"
            placeholder="请输入内容"
          />
        </el-form-item>
        <el-form-item label="特殊分类id" prop="specialId">
          <el-input v-model="form.specialId" placeholder="请输入特殊分类id" />
        </el-form-item>
        <el-form-item label="成本价" prop="costPrice">
          <el-input v-model="form.costPrice" placeholder="请输入成本价" />
        </el-form-item>
        <el-form-item label="最小购买量" prop="minBuy">
          <el-input v-model="form.minBuy" placeholder="请输入最小购买量" />
        </el-form-item>
        <el-form-item label="包装费" prop="bagPrice">
          <el-input v-model="form.bagPrice" placeholder="请输入包装费" />
        </el-form-item>
        <el-form-item label="打印标签id" prop="labelId">
          <el-input v-model="form.labelId" placeholder="请输入打印标签id" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listProduct,
  getProduct,
  delProduct,
  addProduct,
  updateProduct,
} from "@/api/eaten/product";

export default {
  name: "Product",
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 菜品管理表格数据
      productList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        productName: null,
        productPrice: null,
        linePrice: null,
        productNo: null,
        productStock: null,
        sellingPoint: null,
        categoryId: null,
        specType: null,
        deductStockType: null,
        content: null,
        salesInitial: null,
        salesActual: null,
        productSort: null,
        isPointsGift: null,
        isPointsDiscount: null,
        maxPointsDiscount: null,
        isEnableGrade: null,
        isAloneGrade: null,
        aloneGradeEquity: null,
        aloneGradeType: null,
        isAgent: null,
        isIndAgent: null,
        agentMoneyType: null,
        firstMoney: null,
        secondMoney: null,
        thirdMoney: null,
        productStatus: null,
        viewTimes: null,
        shopSupplierId: null,
        supplierPrice: null,
        limitNum: null,
        gradeIds: null,
        productType: null,
        productUnit: null,
        productAttr: null,
        productFeed: null,
        specialId: null,
        costPrice: null,
        minBuy: null,
        bagPrice: null,
        labelId: null,
        isDelete: null,
        appId: null,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        productName: [
          { required: true, message: "产品名称不能为空", trigger: "blur" },
        ],
        sellingPoint: [
          { required: true, message: "商品卖点不能为空", trigger: "blur" },
        ],
        categoryId: [
          { required: true, message: "产品分类id不能为空", trigger: "blur" },
        ],
        specType: [
          {
            required: true,
            message: "产品规格(10单规格 20多规格)不能为空",
            trigger: "change",
          },
        ],
        deductStockType: [
          {
            required: true,
            message: "库存计算方式(10下单减库存 20付款减库存)不能为空",
            trigger: "change",
          },
        ],
        content: [
          { required: true, message: "产品详情不能为空", trigger: "blur" },
        ],
        salesInitial: [
          { required: true, message: "初始销量不能为空", trigger: "blur" },
        ],
        salesActual: [
          { required: true, message: "实际销量不能为空", trigger: "blur" },
        ],
        productSort: [
          {
            required: true,
            message: "产品排序(数字越小越靠前)不能为空",
            trigger: "blur",
          },
        ],
        isPointsGift: [
          {
            required: true,
            message: "是否开启积分赠送(1开启 0关闭)不能为空",
            trigger: "blur",
          },
        ],
        isPointsDiscount: [
          {
            required: true,
            message: "是否允许使用积分抵扣(1允许 0不允许)不能为空",
            trigger: "blur",
          },
        ],
        isEnableGrade: [
          {
            required: true,
            message: "是否开启会员折扣(1开启 0关闭)不能为空",
            trigger: "blur",
          },
        ],
        isAloneGrade: [
          {
            required: true,
            message: "会员折扣设置(0默认等级折扣 1单独设置折扣)不能为空",
            trigger: "blur",
          },
        ],
        isIndAgent: [
          {
            required: true,
            message: "是否开启单独分销(0关闭 1开启)不能为空",
            trigger: "blur",
          },
        ],
        agentMoneyType: [
          {
            required: true,
            message: "分销佣金类型(10百分比 20固定金额)不能为空",
            trigger: "change",
          },
        ],
        firstMoney: [
          {
            required: true,
            message: "分销佣金(一级)不能为空",
            trigger: "blur",
          },
        ],
        secondMoney: [
          {
            required: true,
            message: "分销佣金(二级)不能为空",
            trigger: "blur",
          },
        ],
        thirdMoney: [
          {
            required: true,
            message: "分销佣金(三级)不能为空",
            trigger: "blur",
          },
        ],
        productStatus: [
          {
            required: true,
            message: "产品状态(10上架 20下架 )不能为空",
            trigger: "change",
          },
        ],
        productType: [
          { required: true, message: "0外卖1店内不能为空", trigger: "change" },
        ],
        productUnit: [
          { required: true, message: "商品单位不能为空", trigger: "blur" },
        ],
        productAttr: [
          { required: true, message: "商品属性不能为空", trigger: "blur" },
        ],
        productFeed: [
          { required: true, message: "售卖加料不能为空", trigger: "blur" },
        ],
        specialId: [
          { required: true, message: "特殊分类id不能为空", trigger: "blur" },
        ],
        costPrice: [
          { required: true, message: "成本价不能为空", trigger: "blur" },
        ],
        minBuy: [
          { required: true, message: "最小购买量不能为空", trigger: "blur" },
        ],
        bagPrice: [
          { required: true, message: "包装费不能为空", trigger: "blur" },
        ],
        labelId: [
          { required: true, message: "打印标签id不能为空", trigger: "blur" },
        ],
        isDelete: [
          { required: true, message: "是否删除不能为空", trigger: "blur" },
        ],
        appId: [{ required: true, message: "应用id不能为空", trigger: "blur" }],
      },
    };
  },
  created() {
    this.getList();
  },
  methods: {
    /** 查询菜品管理列表 */
    getList() {
      this.loading = true;
      listProduct(this.queryParams).then((response) => {
        this.productList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        productId: null,
        productName: null,
        productPrice: null,
        linePrice: null,
        productNo: null,
        productStock: null,
        sellingPoint: null,
        categoryId: null,
        specType: null,
        deductStockType: null,
        content: null,
        salesInitial: null,
        salesActual: null,
        productSort: null,
        isPointsGift: null,
        isPointsDiscount: null,
        maxPointsDiscount: null,
        isEnableGrade: null,
        isAloneGrade: null,
        aloneGradeEquity: null,
        aloneGradeType: null,
        isAgent: null,
        isIndAgent: null,
        agentMoneyType: null,
        firstMoney: null,
        secondMoney: null,
        thirdMoney: null,
        productStatus: null,
        viewTimes: null,
        shopSupplierId: null,
        supplierPrice: null,
        limitNum: null,
        gradeIds: null,
        productType: null,
        productUnit: null,
        productAttr: null,
        productFeed: null,
        specialId: null,
        costPrice: null,
        minBuy: null,
        bagPrice: null,
        labelId: null,
        isDelete: null,
        appId: null,
        createTime: null,
        updateTime: null,
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.productId);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加菜品管理";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const productId = row.productId || this.ids;
      getProduct(productId).then((response) => {
        this.form = response.data;
        this.open = true;
        this.title = "修改菜品管理";
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.productId != null) {
            updateProduct(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addProduct(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const productIds = row.productId || this.ids;
      this.$modal
        .confirm('是否确认删除菜品管理编号为"' + productIds + '"的数据项？')
        .then(function () {
          return delProduct(productIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        "eaten/product/export",
        {
          ...this.queryParams,
        },
        `product_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>
